<!DOCTYPE HTML>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Tab组件</title>
    <link media="all" rel="stylesheet" href="../css/component_tab.css" type="text/css" />
    <script src="../js/jquery-1.6.2.min.js" type="text/javascript"></script>
    <script src="../js/component_tab.js" type="text/javascript"></script>
</head>
<body>
    <div class="tab">
    	<ul class="tab-menuWrapper">
    		<li class="J-tab-menu tab-currentMenu">menu1-1</li>
    		<li class="J-tab-menu">menu1-2</li>
    		<li class="J-tab-menu">menu1-3</li>
    	</ul>
        <div class="tab-contentWrapper">
            <div class="J-tab-content"><div>content1-1</div><ul>abc</ul></div>
            <div class="J-tab-content hide"><p>content1-2</p><div>abc</div></div>
            <div class="J-tab-content hide">content1-3</div>
        </div>
    </div>
    <div class="tab">
    	<ul class="tab-menuWrapper">
    		<li class="J-tab-menu">menu2-1</li>
    		<li class="J-tab-menu">menu2-2</li>
    	</ul>
        <div class="tab-contentWrapper">
            <div class="J-tab-content"><div>content2-1</div><ul>abc</ul></div>
            <div class="J-tab-content hide"><p>content2-2</p><div>abc</div></div>
        </div>
    </div>
    <div class="tab">
    	<ul class="tab-menuWrapper">
    		<li class="J-tab-menu">menu3-1</li>
    		<li class="J-tab-menu">menu3-2</li>
    		<li class="J-tab-menu">menu3-3</li>
    		<li class="J-tab-menu">menu3-4</li>
    		<li class="J-tab-menu">menu3-5</li>
    	</ul>
        <div class="tab-contentWrapper">
            <div class="J-tab-content"><div>content3-1</div><ul>abc</ul></div>
            <div class="J-tab-content hide"><p>content3-2</p><div>abc</div></div>
            <div class="J-tab-content hide">content3-3</div>
            <div class="J-tab-content hide"><p>content3-4</p><div>abc</div></div>
            <div class="J-tab-content hide">content3-5</div>
        </div>
    </div>
</body>
</html>
